<script setup lang="ts">
import UserContent from './component/user-content.vue'
import UserSearch from './component/user-search.vue'
import UserModel from './component/user-model.vue'
import { ref } from 'vue'

// 1.绑定UserModel
const modelRef = ref<InstanceType<typeof UserModel>>()

// 2.新建用户(子传父)
const handleCreateClick = () => {
  // 2.1调用modelRef新建用户
  modelRef.value?.showModel()
}

// 3.编辑用户（子传父携带数据）
const handleEditClick = (data: any) => {
  // 2.1调用modelRef编辑用户并将数据传送
  modelRef.value?.showModel(false, data)
}
</script>

<template>
  <div class="goods">
    <UserSearch />
    <UserContent @handle-create-click="handleCreateClick" @handle-edit-click="handleEditClick" />
    <UserModel ref="modelRef" />
  </div>
</template>

<style lang="less" scoped>
.goods {
}
</style>
